<template>
  <div>
    <a v-if="fiterList.length == 0" @click="plusAdd()" href="javascript:void(0);">添加</a>

    <a-row
      v-for="(item, index) in fiterList"
      :key="index"
      :gutter="16"
      :class="index == fiterList.length - 1 ? '' : 'row_margin'"
    >
      <a-col :span="1">
        <a href="javascript:void(0);">{{ index + 1 }}</a>
      </a-col>
      <a-col :span="8">
        <SearchField
        v-show="item.nonexistent != true"
          ref="searchFieldRef"
          :f_treeData="fieldList"
          @f_setField="s_setField"
          field="field"
          :index="index"
          :value="item.field"
        />
        <a v-show="item.nonexistent == false && index == fiterList.length - 1" @click="nonexistentClick(item)" href="javascript:void(0);">未找到？</a>
         <a-input v-if="item.nonexistent == true" allow-clear v-model="item.field" placeholder="请输入查询字段" />
      </a-col>
      <a-col :span="1"> = </a-col>
      <a-col :span="10">
        <a-input allow-clear v-model="item.value" placeholder="请输入条件值" />
      </a-col>
      <!-- 操作按钮 -->
      <a-col :span="3">
        <a-popconfirm
          class="plusBox"
          title="确定删除吗？"
          ok-text="是"
          cancel-text="否"
          @confirm="plusDel(item, index)"
        >
          <a-icon slot="icon" type="delete" />
          <a-icon type="minus" />
        </a-popconfirm>
        <span v-if="index + 1 == fiterList.length" class="plusBox" @click.stop="plusAdd()">
          <a-icon type="plus" />
        </span>
      </a-col>
    </a-row>
  </div>
</template>
<script>
export default {
  props: {
    fieldList: {
      type: Array
    },
    valuelist: {
      type: Array
    }
  },
  data() {
    return {
      fiterList: this.valuelist || []
    }
  },
  created() {},
  mounted() {},
  methods: {
    // 未找到字段
    nonexistentClick(item) {
      item.nonexistent = true
    },
    s_setField(value, field, index) {
      this.fiterList[index][field] = value
    },
    plusAdd() {
      this.fiterList.push({
        field: undefined,
        value: undefined,
        nonexistent: false, // 不存在
      })
    },
    plusDel(item, index) {
      this.fiterList.splice(index, 1)
    },
    f_checkfilter() {
      let check = { status: false, value: this.fiterList }
      if (this.fiterList.length > 0) {
        let i = 0
        for (let v of this.fiterList) {
          if (!v.field) {
            this.$message.warning(`请选择${i + 1}号的过滤字段`)
            return check
          }
          if (!v.value) {
            this.$message.warning(`请输入${i + 1}号的过滤值`)
            return check
          }
          i++
        }
      }
      check.status = true
      return check
    }
  },
  components: {
    SearchField: () => import('@/views/businessAssembly/public/spareparts/searchField.vue')
  }
}
</script>

<style lang="less" scoped>
.plusBox {
  margin: 0 10px 0 0;
  cursor: pointer;
  color: #1e90ff;
}

.row_margin {
  margin: 0 0 10px;
}

/deep/.ant-row {
  margin: 0 !important;
}
</style>
